<template>
  <div>
    <el-dropdown @command="command">
      <svg-icon icon-class="language" />
      <template #dropdown>
        <el-dropdown-menu>
          <el-dropdown-item command="zh"
                            :disabled="$i18n.locale==='zh'">中文</el-dropdown-item>
          <el-dropdown-item command="en"
                            :disabled="$i18n.locale==='en'">English</el-dropdown-item>
        </el-dropdown-menu>
      </template>
    </el-dropdown>
  </div>
</template>

<script>
import cookies from 'js-cookie'
export default {
  name: 'Lang',
  inject: ['onLoad'],
  methods: {
    // 点击下拉框中某一种语言，实现切换语言功能
    command (command) {
      // 切换网页的语言功能
      this.$i18n.locale = command
      // 设置语言的同时把语言也要保存到cookies中
      cookies.set('locale', command)
      // 刷新页面---这种方法让用户的眼前一闪，用户体验性不好
      // this.$router.go()
      // 可以使用静默刷新
      this.onLoad()
    }
  }
}
</script>

<style>
</style>
